<template>
  <div class="home">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="部门选择">
        <el-input v-model="form.orgId" @focus="openOrgSelect"></el-input>
      </el-form-item>

      <el-button @click="openModal">打开modal</el-button>
      <el-button @click="openSaveDemo">保存编辑</el-button>
    </el-form>

    <yx-modal
      title="测试标题"
      :visible.sync="dialogVisible"
      :closeOnClickModal="false"
    >
      <h1>aaaa</h1>
      <h2>bbbb</h2>
    </yx-modal>
    <org-select :visible.sync="orgSelectVisible" @ok="orgSelectOk" @cancel="cancel" :isMultiple="false"></org-select>
    <save-demo ref="saveDemoRef" @ok="saveDemoOk"></save-demo>
  </div>
</template>
  
  <script>
// @ is an alias to /src
import OrgSelect from "@/components/org/orgSelect.vue";
import SaveDemo from "@/views/demo/SaveDemo.vue";

export default {
  name: "HomeView",
  components: {
    OrgSelect,SaveDemo
  },
  data() {
    return {
      form: {},
      dialogVisible: false,
      orgSelectVisible: false,
    };
  },
  created() {
    this.$axios.get('/api/user').then(res=>{
      console.log(res)
    })
  },
  methods: {
    openModal() {
      this.dialogVisible = true;
    },
    openOrgSelect() {
        this.orgSelectVisible = true;
    },
    openSaveDemo(){
      this.$refs.saveDemoRef.show()
    },
    saveDemoOk(param){
      console.log("saveDemoOk: ",param)
    },
    orgSelectOk(param){
      console.log("orgSelectOk: ",param,this.orgSelectVisible)
    },
    cancel(){
      console.log("cancel: ",this.orgSelectVisible)
    }
  },
};
</script>